<template>
  <view class="goodsitem-container" @click="goToDetail()">
    <view style="position: relative">
      <u--image
        :showLoading="true"
        :src="src"
        width="340rpx"
        height="340rpx"
      ></u--image>
      <view class="play">
        <u-icon name="play-circle" color="#fff" size="38"></u-icon>
        <!--  -->
      </view>
    </view>

    <view class="goodsitemtextbox">
      <view class="name u-line-2">
        【彩箱】四川丑橘不知火当季新鲜时令水果净重5斤单果70mm以上
      </view>
      <!-- <view class="u-flex">
				<u-button text="包邮" size="mini" type="error" plain :customStyle="btncustomStyle"></u-button>
				<u-button text="货版一致" size="mini" type="error" plain :customStyle="btncustomStyle"></u-button>
			</view>
			<view class="price">
				¥35/斤
			</view> -->
      <view class="time"> 2025-03-03 </view>
    </view>
  </view>
</template>

<script>
import goodsitem from "@/static/goodsitem.jpg";
export default {
  name: "goodsitem",
  data() {
    return {
      src: goodsitem,
      btncustomStyle: {
        width: "auto",
        margin: "0 10rpx 0 0",
        minWidth: "auto",
      },
    };
  },
  methods: {
    goToDetail(id) {
      uni.navigateTo({
        url: "/pages/shop/goods/detail/detail?id=" ,
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.goodsitem-container {
  height: 480rpx;
  width: 340rpx;
  background: #fff;
  margin-bottom: 16rpx;
  border-radius: 20rpx;
  overflow: hidden;
  .play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .goodsitemtextbox {
    box-sizing: border-box;
    display: flex;
    font-size: 28rpx;
    flex-direction: column;
    justify-content: space-between;
    height: 140rpx;
    padding: 10rpx;

    .name {
      color: #6c6c6c;
    }

    .price {
      color: #f56c6c;
    }
    .time {
      color: $uni-text-color-grey;
    }
  }
}
</style>
